import type { ComponentType } from '#/adapter/component';
import type { VbenFormProps } from '#/adapter/form';
import type { VxeTableGridOptions } from '#/adapter/vxe-table';

import { $t } from '@vben/locales';

import { Tag } from 'ant-design-vue';

import { DictEnum, FileBizTypeEnum } from '#/enums/commonEnum';
import { yesNoComponentProps } from '#/utils/form/component';

// 表格参数定义
export const gridSchemas: VxeTableGridOptions<any> = {
  toolbarConfig: {
    slots: {
      buttons: 'toolbar-buttons',
    },
  },
  columns: [
    { type: 'checkbox', width: 50 },
    { title: $t('common.seq'), type: 'seq', width: 50 },
    {
      field: 'appKey',
      title: $t('devOperation.application.defApplication.appKey'),
    },
    {
      field: 'name',
      title: $t('devOperation.application.defApplication.name'),
    },
    {
      field: 'version',
      width: 100,
      title: $t('devOperation.application.defApplication.version'),
    },
    {
      field: 'type',
      width: 120,
      title: $t('devOperation.application.defApplication.type'),
      slots: {
        default: ({ row }) => {
          return (
            <Tag color={row.type === '10' ? 'success' : 'processing'}>
              {row.echoMap?.type}
            </Tag>
          );
        },
      },
    },
    {
      field: 'isGeneral',
      width: 120,
      title: $t('devOperation.application.defApplication.isGeneral'),
      slots: {
        default: ({ row }) => {
          return (
            <Tag color={row.isGeneral ? 'success' : 'error'}>
              {row.isGeneral ? $t('common.yes') : $t('common.no')}
            </Tag>
          );
        },
      },
    },
    {
      field: 'sortValue',
      width: 50,
      title: $t('devOperation.application.defApplication.sortValue'),
    },
    {
      field: 'createdTime',
      formatter: 'formatDateTime',
      sortable: true,
      width: 180,
      title: $t('common.createdTime'),
    },
    {
      field: 'action',
      fixed: 'right',
      title: '操作',
      slots: { default: 'ACTION' },
      width: 150,
    },
  ],
};
// 搜索表单参数定义
export const searchFormSchemas: VbenFormProps = {
  schema: [
    {
      component: 'Input',
      fieldName: 'appKey',
      label: $t('devOperation.application.defApplication.appKey'),
      componentProps: {
        placeholder: '请输入',
        allowClear: true,
      },
    },
    {
      component: 'Input',
      fieldName: 'name',
      label: $t('devOperation.application.defApplication.name'),
      componentProps: {
        placeholder: '请输入',
        allowClear: true,
      },
    },
    {
      component: 'Input',
      fieldName: 'type',
      label: $t('devOperation.application.defApplication.type'),
      componentProps: {
        placeholder: '请输入',
        allowClear: true,
      },
    },
    {
      component: 'Input',
      fieldName: 'createdTime',
      label: $t('common.createdTime'),
      componentProps: {
        placeholder: '请输入',
        allowClear: true,
      },
    },
  ],
};

// 表单参数定义
export const formSchamas: VbenFormProps<ComponentType> = {
  wrapperClass: 'grid-cols-12', // 24栅格,
  commonConfig: {
    formItemClass: 'col-span-12',
  },
  schema: [
    {
      fieldName: 'id',
      label: 'ID',
      component: 'Input',
      ifDetail: false,
      dependencies: {
        show: false,
        triggerFields: ['id'],
      },
    },
    {
      fieldName: 'appendixIcon',
      label: $t('devOperation.application.defApplication.logo'),
      component: 'Avatar',
      componentProps: {
        placeholder: '请选择logo',
        showBtn: false,
        uploadParams: { bizType: FileBizTypeEnum.DEF_APPLICATION_LOGO },
      },
      formItemClass: 'col-span-12',
    },
    {
      fieldName: 'name',
      label: $t('devOperation.application.defApplication.name'),
      component: 'Input',
      componentProps: {
        placeholder: '请输入',
        allowClear: true,
      },
      formItemClass: 'col-span-6',
      detailSpan: 12,
    },
    {
      fieldName: 'version',
      label: $t('devOperation.application.defApplication.version'),
      component: 'Input',
      componentProps: {
        placeholder: '请输入',
        allowClear: true,
      },
      formItemClass: 'col-span-6',
      detailSpan: 12,
    },
    {
      fieldName: 'redirect',
      label: $t('devOperation.application.defApplication.redirect'),
      component: 'Input',
      componentProps: {
        placeholder: '请输入',
        allowClear: true,
      },
      formItemClass: 'col-span-6',
      detailSpan: 12,
    },
    {
      fieldName: 'type',
      label: $t('devOperation.application.defApplication.type'),
      component: 'ApiDict',
      componentProps: {
        placeholder: '请选择',
        type: DictEnum.APPLICATION_TYPE,
        renderType: 'RadioGroup',
        isBtn: true,
      },
      formItemClass: 'col-span-6',
      detailSpan: 12,
    },
    {
      fieldName: 'introduce',
      label: $t('devOperation.application.defApplication.introduce'),
      component: 'Input',
      componentProps: {
        placeholder: '请输入',
        allowClear: true,
      },
      formItemClass: 'col-span-6',
      detailSpan: 12,
    },
    {
      fieldName: 'url',
      label: $t('devOperation.application.defApplication.url'),
      component: 'Input',
      componentProps: {
        placeholder: '请输入',
        allowClear: true,
      },
      formItemClass: 'col-span-6',
      detailSpan: 12,
    },
    {
      fieldName: 'remark',
      label: $t('devOperation.application.defApplication.remark'),
      component: 'Textarea',
      componentProps: {
        placeholder: '请输入',
      },
      formItemClass: 'col-span-12',
      detailSpan: 12,
    },
    {
      fieldName: 'isVisible',
      label: $t('devOperation.application.defApplication.isVisible'),
      component: 'RadioGroup',
      componentProps: {
        ...yesNoComponentProps(),
      },
      formItemClass: 'col-span-6',
      detailSpan: 6,
    },
    {
      fieldName: 'isGeneral',
      label: $t('devOperation.application.defApplication.isGeneral'),
      component: 'RadioGroup',
      componentProps: {
        ...yesNoComponentProps(),
      },
      formItemClass: 'col-span-6',
      detailSpan: 6,
    },
    {
      fieldName: 'sortValue',
      label: $t('devOperation.application.defApplication.sortValue'),
      component: 'InputNumber',
      componentProps: {
        placeholder: '请输入',
        allowClear: true,
      },
      formItemClass: 'col-span-6',
      detailSpan: 12,
    },
  ],
};
